<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="./res/jquery-easyui-1.6.3/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="./res/jquery-easyui-1.6.3/themes/icon.css">
    <script type="text/javascript" src="./res/jquery-easyui-1.6.3/jquery.min.js"></script>
    <script type="text/javascript" src="./res/jquery-easyui-1.6.3/jquery.easyui.min.js"></script>
    <script src="./res/jquery-easyui-1.6.3/locale/easyui-lang-zh_CN.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
    .menu-link {
        height: 25px;
        line-height: 25px;
        cursor: pointer;
        margin-bottom: 5px;
        border-bottom: 1px solid #ccc;
        padding-left: 30px;
        position: relative;
    }

    .menu-link:hover {
        background-color: #E68900;
    }

    /*解决出现双重边框线*/
    #mainContentBox.panel-body {
        border: none;
    }

    /*解决右边出现双重滚动条*/
    #tabs .tabs-panels>.panel>.panel-body {
        overflow: hidden;
        border: none;
        border-width: 0px;
        border-style: solid;
    }

    #menuDivBox .panel-with-icon {
        padding-left: 10px;
    }
</style>
</head>
<body class="easyui-layout">
    <!--顶部logo区域-->
    <div data-options="region:'north',border:false" style="height:50px;overflow: hidden;">
        <div style="width: 500px; float: left; padding-left: 10px; line-height: 50px; font-size: 40px; font-weight: bold; ">${title}</div>
        <div style="width: 180px; float: right; text-align: center;line-height: 50px;">
            <a href="javascript:openUpdatePasswordDialog()" class="easyui-linkbutton" style="width:80px">修改密码</a>
            <a href="javascript:confirmLogout()" class="easyui-linkbutton" style="width:80px">安全退出</a>
        </div>
        <div style="width: 500px; float: right;line-height: 50px; font-size: 22px; text-align: right;">
            <span style="color: red; font-weight: bold;">XXXX</span>
        </div>
    </div>
    <!--顶部logo区域-->

    <!--左侧导航菜单区域-->
    <div data-options="region:'west',split:true,title:'导航菜单'" style="width:200px;">
        <div class="menu-link" linkUrl="">菜单1</div>
        <div class="menu-link" linkUrl="">菜单2</div>
    </div>
    <!--左侧导航菜单区域end-->

    <!-- 主要区域区 -->
    <div id="mainContentBox" data-options="region:'center'">
        <div id="tabs" class="easyui-tabs" fit="true" border="false">
            <div title="欢迎使用" style="padding:20px; overflow:hidden;" id="home">
            </div>
        </div>
    </div>
    <!-- 主要区域区end -->

    <!--底部版权信息-->
    <div data-options="region:'south',border:false" style="height:20px;">
        <div style="text-align: center;line-height: 20px; color: #CCCCCC;">版权所有：<a href="#" style="color: #CCCCCC; text-decoration: none;">450153554@qq.com</a></div>
    </div>
    <!--底部版权信息end-->
</body>

</html>